<template>
	<view class="xilu">
		<view class="container plr20">
			<view class="pb30">
				<template v-if="list.length > 0">
					<view class="xilu_item flex-box" v-for="(vo,keys) in list" @click="toOrderDetail(vo.id)">
						<view class="flex-grow-1">
							<view class="fs32 colf lh44">{{vo.pay_body || ''}}</view>
							<view class="mt20 fs28 col9 lh40">{{vo.pay_time || ''}}</view>
						</view>
						<view class="col2 fs40"><text>{{ vo.pay_type || '' }}：</text>{{vo.total_amount || 0}}</view>
					</view>
				</template>

				<template v-else>
					<button @click="getList()" class="colf">刷新数据</button>
					<empty-data :tips="'暂无订单数据'" :lineHeight="150"></empty-data>
				</template>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				total_count: 0,
				pay_type: ''
			}
		},
		methods: {
			//订单明细
			getList() {
				let _this = this;
				_this.$http({
					url: '/addons/xilufitness/market_order/getOrderList',
					method: 'get'
				}).then(res => {
					_this.list = res.data.list.map((item, index) => {
						return {
							...item,
							pay_type: 
							item.pay_type == 1 ? '余额支付' : 
							item.pay_type == 2 ? '微信支付' : 
							item.pay_type == 3 ? '积分支付' : 
							item.pay_type == 4 ? '混合支付' : ''

						}

					})

				}).catch(error => {
					console.log('rechargeOrderError', error);
				})
			},
			toOrderDetail(id) {
				this.$api.navigate('../points_order_detail/points_order_detail?id=' + id);
			}
		},
		onLoad() {
			this.getList();
		},
		onReachBottom() {
			let list = this.list;
			let total_count = this.total_count;
			if (total_count > list.length) {
				this.page = this.page + 1;
				this.getList();
			}
		},
		onShareAppMessage() {

		}
	}
</script>

<style lang="scss" scoped>
	.xilu {
		&_item {
			width: 700rpx;
			height: 155rpx;
			background: #404243;
			border-radius: 20rpx;
			margin-top: 30rpx;
			padding: 0 30rpx;
		}
	}
</style>